<template>
  <el-card class="box-card" shadow="always">
    <el-breadcrumb separator="/">
      <el-breadcrumb-item :to="{path: '/'}">首页</el-breadcrumb-item>
      <el-breadcrumb-item v-for="item in routers" :key="item.path">
        {{ item?.meta?.title }}
      </el-breadcrumb-item>
    </el-breadcrumb>
  </el-card>
</template>


<script setup lang="ts">
import {reactive, toRefs, ref, computed} from 'vue'
import {useRouter} from 'vue-router'

const router = useRouter()
console.log(router.currentRoute.value.matched)

const routers = computed(() => {
  return router.currentRoute.value.matched.filter(item => item.meta.title)
})
</script>

<style lang="less" scoped>

</style>
